<template>
  <div id="main">
    <div id="" class="card">
      <div style="width: 1000px;height: auto; margin: auto;padding: 5px">
        <!--操作按钮-->
        <el-form :inline="true" class="demo-form-inline center" >
          <el-row :gutter="18">
            <el-col :span="15"><el-button type="danger" icon="el-icon-delete" plain @click="noAudit">拒绝请求</el-button></el-col>
            <el-col :span="3"><el-button type="success" icon="el-icon-success" plain @click="auditPur">通过申请</el-button></el-col>
            <el-col :span="3"><el-button icon="el-icon-refresh" plain onclick="history.go(-1)">返回</el-button></el-col>
          </el-row>
        </el-form>

        <el-form :inline="true" class="demo-form-inline">
          <el-row>
            <el-col :span="7">
              <el-form-item label="入库编号:">
                <input v-model="outGather.storageId" style="border: none" readonly>
              </el-form-item>
            </el-col>
            <el-col :span="7">
              <el-form-item label="总数量:">
                <input v-model="outGather.total"  style="border: none">
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="总价格:">
                <input v-model="outGather.amount"  style="border: none">
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="7">
              <el-form-item label="入库仓库:">
                <input v-model="outGather.stockName" style="border: none" readonly>
              </el-form-item>
            </el-col>
            <el-col :span="7">
              <el-form-item label="申请人:">
                <input v-model="outGather.register"  style="border: none" readonly>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="申请时间:">
                <input v-model="outGather.registerTime"  style="border: none" readonly>
              </el-form-item>
            </el-col>
          </el-row>
          <!--数据表格-->
          <el-table
              :data="outDetail">
            <el-table-column
                prop="imgUrl"
                label="图片"
                width="180">
            </el-table-column>
            <el-table-column
                prop="productName"
                label="商品名称"
                width="200">
            </el-table-column>
            <el-table-column
                prop="costPrice"
                label="单价(元)"
                width="200">
            </el-table-column>
            <el-table-column
                prop="amount"
                label="数量(件)"
                width="200">
            </el-table-column>
            <el-table-column
                prop="subtotal"
                label="小计(元)"
                width="200">
              <template slot-scope="scope">
                <span>{{scope.row.subtotal}}元</span>
              </template>
            </el-table-column>
          </el-table>
          <div class="card">
            <el-row>
              <el-col :span="10">
                <el-form-item label="审核人:">
                  <el-input v-model="outGather.checker" ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="10">
                <el-form-item label="审核时间:">
                  <el-input v-model="outGather.checkTime"  style="border: none" disabled></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-form-item label="审核理由:">
              <el-input :rows="4" type="textarea" v-model="outGather.checkReason" ></el-input>
            </el-form-item>
          </div>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "OutAuditDetail",
  data() {
    return {
      //出库单
      outGather: {},
      //出库单详情
      outDetail: [],
    }
  },
  created() {
    this.outGather.checkTime = this.nowDate()
    this.getOne()
  },
  methods: {
    //获取当前时间
    nowDate() {
      let getTime = new Date().getTime();
      let time = new Date(getTime);
      let year = time.getFullYear();//年
      let month = (time.getMonth() + 1).toString().padStart(2, '0');
      let date = time.getDate().toString().padStart(2, '0');
      let hour = time.getHours().toString().padStart(2, '0');
      let minute = time.getMinutes().toString().padStart(2, '0');
      let second = time.getSeconds().toString().padStart(2, '0');
      return (
          year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second
      )
    },
    async getOne(){
      const id=sessionStorage.getItem("OutStock")
      const {data :res}=await this.$http.post
      (`outGather/getOne/${id}`)
      this.outGather=res

      const {data :detail}=await this.$http.post
      (`outDetails/getByParentId/${id}`)
      this.outDetail=detail
    },
    //审核通过
    async auditPur(){
      this.outGather.checkTag="S001-2"
      this.outGather.list=this.outDetail
      console.log(this.outGather)
      let o=confirm("您确定要通过？")
      if(o){
        const {data :res}=await this.$http.post
        (`outGather/audit`,this.outGather)
        if(res){
          this.$message({
            message: '操作成功！已通过请求',
            type: 'success'
          })
          this.$router.push("/outAudit")
        }
      }
      console.log(this.outGather)
    },
    //拒绝申请
    async noAudit(){
      this.storage.checkTag="S001-3"
      this.outGather.list=this.outDetail
      console.log(this.outGather)
      let o=confirm("您确定要拒绝？")
      if(o){
        const {data :res}=await this.$http.post
        (`outGather/audit`,this.outGather)
        if(res){
          this.$message({
            message: '操作成功！已拒绝请求',
            type: 'success'
          })
          this.$router.push("/outAudit")
        }
      }
      console.log(this.outGather)
    }
  }
}
</script>

<style scoped>
.card {
  box-sizing: border-box;
  padding: 20px;
  overflow-x: hidden;
  background-color: #ffffff;
  border: 1px solid #e4e7ed;
  border-radius: 6px;
  box-shadow: 0 0 12px #0000000d
}
.page{
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
}
</style>